<template>
  <el-dialog
    :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible" width="800px"
    @close="clearDataList()" >
    <div style="height: 50vh">
      <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="130px">
        <el-form-item label="人员编号" prop="ryCode">
          <el-input v-model="dataForm.ryCode" :disabled="formEdit" placeholder="人员编号" class="wbf90"></el-input>
        </el-form-item>
        <el-form-item label="姓名" prop="ryXm">
          <el-input v-model="dataForm.ryXm" placeholder="姓名" class="wbf90"></el-input>
        </el-form-item>
        <el-form-item label="职位" prop="ryZhiwei">
          <el-input v-model="dataForm.ryZhiwei" placeholder="职位" class="wbf90"></el-input>
        </el-form-item>
        <el-form-item label="职务" prop="ryZhiwu">
          <el-input v-model="dataForm.ryZhiwu" placeholder="职务" class="wbf90"></el-input>
        </el-form-item>
        <el-form-item label="职务级别" prop="ryZwjbbh">
          <el-select :clearable="true" v-model="dataForm.ryZwjbbh" @change="elChange" placeholder="请选择" class="xiaLa wbf90">
            <el-option v-for="(item,index) in userZjOptions " :key="index" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="附加员工状态" prop="ryYgzt">
          <el-input v-model="dataForm.ryYgzt" placeholder="附加员工状态" class="wbf90"></el-input>
        </el-form-item>
        <!--<el-form-item label="所属二级单位" prop="ryEjdw">-->
        <!--  el-input v-model="dataForm.ryEjdw" readonly placeholder=""></el-input>-->
        <!--</el-form-item>-->
        <el-form-item label="所属三级单位" prop="rySjdw">
          <avue-input-tree v-model="dataForm.rySjdwId" :node-click="getNodeDataSjdw" :dic="treeDeptData"
                           :props="defaultProps" placeholder="请选择三级单位" class="wbf90" />
        </el-form-item>
        <el-form-item label="工资范围" prop="ryGzfw" >
          <avue-input-tree v-model="dataForm.ryGzfwId" :node-click="getNodeDataGzfw" :dic="treeDeptData"
                           :props="defaultProps" placeholder="请选择工资范围" class="wbf90" />
        </el-form-item>
      </el-form>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="dataFormSubmit()" v-if="canSubmit">确定</el-button>
      <el-button @click="clearDataList" type="primary" plain>取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
    import {getObjByCode,addObj,putObj} from '@/api/admin/sysryxxb'
    import {fetchTree,getTreeList} from '@/api/admin/dept'
    import {remote as remoteDict } from '@/api/admin/dict'


    export default {
    data () {
      var validateRyCode = (rule, value, callback) => {
          if (value !== '' && this.formEdit === false) {
            getObjByCode(value).then((res)=>{
              if(res.data.data.length !== 0){
                callback(new Error("人员编号不可重复"));
              }else {
                callback();
              }
            })
          }else {
            callback();
          }
      };
      return {
        visible: false,
        canSubmit: false,
        treeDeptData: [],
        defaultProps: {
          label: 'name',
          value: 'id'
        },
        formEdit:false,
        //20210906 新增职级下拉
        userZjOptions:[],
        dataForm: {
          ryGzfwId: 0,
          rySjdwId: 0,
          ryEjdwId: 0,
          id: 0,
          ryCode: '',
          ryXm: '',
          ryZhiwu: '',
          ryZhiwei: '',
          ryZwjb: '',
          ryZwjbbh:'',
          ryYgzt: '',
          ryEjdw: '',
          ryEjdwCode: '',
          rySjdw: '',
          rySjdwCode: '',
          ryGzfw: '',
          ryGzfwCode: '',
          createTime: '',
          editTime: '',
          createDeptId: '',
          createDeptName: '',
          createUserId: '',
          createUserName: '',
          editDeptId: '',
          editDeptName: '',
          editUserId: '',
          editUserName: '',
          dataState: '',
          deptId: '',
          tenantId: ''
        },
        dataRule: {
          ryCode: [
            { required: true, message: '人员编号不能为空', trigger: 'blur' },
            { min: 8, max: 8, message: '人员编号为8个字符', trigger: 'blur' },
            { validator: validateRyCode, trigger: 'blur' }
          ],
          ryXm: [
            { required: true, message: '姓名不能为空', trigger: 'blur' }
          ],
          ryZhiwu: [
            { required: true, message: '职务不能为空', trigger: 'blur' }
          ],
          ryZhiwei: [
            { required: true, message: '职位不能为空', trigger: 'blur' }
          ],
          ryZwjbbh: [
            { required: true, message: '职务级别不能为空', trigger: 'blur' }
          ],
          ryYgzt: [
            { required: true, message: '附加员工状态不能为空', trigger: 'blur' }
          ],
          // ryEjdw: [
          //   { required: true, message: '所属二级单位不能为空', trigger: 'blur' }
          // ],
          rySjdw: [
            { required: true, message: '所属三级单位不能为空', trigger: 'blur' }
          ],
          ryGzfw: [
            { required: true, message: '工资范围不能为空', trigger: 'blur' }
          ]
        }
      }
    },
    created() {
      fetchTree().then(response => {
        this.treeDeptData = response.data.data
        ////console.log(this.treeDeptData);
      })
    },
    methods: {
      elChange(value){
        if(value === ''){
          this.ryZwjb = "";
          return;
        }
        for(let item of this.userZjOptions){
          if(item.value == value){
            this.dataForm.ryZwjb = item.label;
            break;
          }
        }
      },
      //所属三级单位
      getNodeDataSjdw(data,node){
        ////console.log(data);
        ////console.log(data.$parent);

        // 顶级root需要特殊处理
        if(data.$parent == undefined){
          this.dataForm.ryEjdw =data.deptName;
          this.dataForm.ryEjdwCode = data.deptCode;
          this.dataForm.ryEjdwId = data.id;
        }else {
          this.dataForm.ryEjdw = data.$parent.deptName;//data.$parent.name,
          this.dataForm.ryEjdwCode = data.$parent.deptCode;
          this.dataForm.ryEjdwId = data.$parent.id;
        }

        this.dataForm.rySjdw = data.deptName;
        this.dataForm["rySjdwCode"] = data.deptCode;
        this.dataForm.deptId = data.id;
      },
      //工资范围
      getNodeDataGzfw(data,node) {
        this.dataForm["ryGzfwCode"] = data.deptCode;
        this.dataForm.ryGzfw = data.deptName;
      },
      init (id) {
        //借用id字段存值
        this.dataForm.id = id || 0;
        this.visible = true;
        this.canSubmit = true;
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields();

          remoteDict("user_zj").then(response => {
            this.userZjOptions = response.data.data
          })

          if (this.dataForm.id) {
            this.formEdit = true;
            getObjByCode(this.dataForm.id).then(response => {
              this.dataForm = response.data.data[0];
            })
          }else {
            this.formEdit = false;
          }
        })
      },
      // 表单提交
      dataFormSubmit () {
        ////console.log(this.dataForm);
        // return;
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.canSubmit = false;
            if (this.dataForm.id) {
                putObj(this.dataForm).then(data => {
                    this.$notify.closeAll();
                    this.$notify.success('修改成功')
                    this.visible = false
                    this.$emit('refreshDataList')
                }).catch(() => {
                    this.canSubmit = true;
                });
            } else {
                addObj(this.dataForm).then(data => {
                    this.$notify.closeAll();
                    this.$notify.success('添加成功')
                    this.visible = false
                    this.$emit('refreshDataList')
                }).catch(() => {
                    this.canSubmit = true;
                });
            }
          }
        })
      },

      //清空记录
      clearDataList(){
        this.initNone();
        this.visible = false;
      },
      //初始化
      initNone(){
        this.dataForm = {};
        this.dataForm = {
          id: 0,
            ryCode: '',
            ryXm: '',
            ryZhiwu: '',
            ryZhiwei: '',
            ryZwjb: '',
            ryZwjbbh:'',
            ryYgzt: '',
            ryEjdw: '',
            ryEjdwCode: '',
            rySjdw: '',
            rySjdwCode: '',
            ryGzfw: '',
            ryGzfwCode: '',
            createTime: '',
            editTime: '',
            createDeptId: '',
            createDeptName: '',
            createUserId: '',
            createUserName: '',
            editDeptId: '',
            editDeptName: '',
            editUserId: '',
            editUserName: '',
            dataState: '',
            deptId: '',
            tenantId: ''
        }
      }
    }
  }
</script>
